<template>
  <div class="app-main-container">
    <div class="df_ac mb20">
      <span
        class="pointer"
        @click="routerPush('/application/applicationCenter')"
      >应用中心</span>
      <i class="ml10 mr10 el-icon-arrow-right" />
      <span class="pointer">会员画像营销</span>
    </div>
    <el-tabs v-model="activeName">
      <el-tab-pane
        label="会员画像"
        name="first"
      ><PortrayalMem
        v-if="activeName == 'first'"
        ref="PortrayalMemRef"
      /></el-tab-pane>
      <el-tab-pane
        label="营销计划"
        name="second"
      ><Marketing
        v-if="activeName == 'second'"
        @addPortrayal="addPortrayal"
      /></el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import Marketing from './components/Marketing'
import PortrayalMem from './components/PortrayalMem'
export default {
  components: {
    Marketing,
    PortrayalMem
  },
  data() {
    return {
      activeName: 'first'
    }
  },
  created() {
    if (this.$route.query.portrayalFlag && this.$route.query.portrayalFlag === '1') {
      this.activeName = 'first'
      this.$nextTick(() => {
        this.$refs.PortrayalMemRef.handleEdit()
      })
    }
  },
  activated() {
    if (this.$route.query.portrayalFlag && this.$route.query.portrayalFlag === '1') {
      this.activeName = 'first'
      this.$nextTick(() => {
        this.$refs.PortrayalMemRef.handleEdit()
      })
    }
  },
  methods: {
    routerPush(path) {
      this.$router.push(path)
    },
    addPortrayal() {
      this.activeName = 'first'
      this.$nextTick(() => {
        this.$refs.PortrayalMemRef.handleEdit()
      })
    }
  }
}
</script>

<style>
</style>
